<template>
  <div class="lowmission">
    <!-- 新建任务页面 -->
    <!-- <div class="backbtn" @click="backto()">返回任务列表</div> -->
    <div class="tablistbox">
      <!-- <a href="javascript:void(0);" :class="index==isactive?'active':''" @click="handelchange(index)" :key="index" v-for="(item,index) in tablist">{{ item.name }}</a> -->
      <a class="active">任务概况</a>
    </div>
    <info></info>
    <!-- <intro></intro>
        <Executor></Executor> -->
  </div>
</template>

<script>
import info from './commonMis/info.vue';
import intro from './commonMis/intro.vue';
import Executor from './commonMis/Executor.vue';
import Reviewer from './commonMis/Reviewer.vue';

export default {
  name: 'lowmission',
  data() {
    return {};
  },
  components: {
    info,
    intro,
    Executor,
    Reviewer
  },
  methods: {
    // handelchange(index) {
    //   this.isactive = index;
    //   if (index === 0) {
    //     this.currentView = 'info';
    //   } else if (index === 1) {
    //     this.currentView = 'intro';
    //   } else if (index === 2) {
    //     this.currentView = 'Executor';
    //   } else if (index === 3) {
    //     this.currentView = 'Reviewer';
    //   }
    // }
  }
};
</script>

<style lang="less" scoped>
.lowmission {
  margin: 20px;
  position: relative;
  .backbtn {
    position: absolute;
    right: 0;
    top: 35px;
    color: #555;
    font-size: 16px;
    cursor: pointer;
  }
  a {
    color: #555;
    width: 140px;
    height: 55px;
    border: 1px solid #ececec;
    line-height: 55px;
    font-size: 14px;
    text-align: center;
    background: #ffffff;
    border-radius: 8px 8px 0px 0px;
    border: 1px solid #ececec;
    display: inline-block;
  }
  .active {
    position: relative;
    border-bottom: none;
    width: 140px;
    height: 55px;
    line-height: 55px;
    font-size: 16px;
    font-weight: bolder;
    box-shadow: 1px -2px 3px 0 #99999980;
  }
}
</style>
